<template>
	<view :class="['cu-list menu-avatar FirstList margin-xs radius shadow shadow-lg bg-white' ,BackGroundBox]" :style="{marginTop: marginTop + 'rpx'}">
		<block v-for="(item,index) in list" :key="index">
			<view class="cu-item" @tap="backTo(item)" v-if="item.isShow">
				<view class="cu-avatar radius lg" :style="{'backgroundImage':'url(' + ip + '/image/UserImage/FaceImage/' + item.LPHOTO + ')'}"></view>
				<view class="content">
					<view class="text-pink">
						<view class="text-cut">{{item.LUSERNAME}}</view>
					</view>
					<view class="text-gray text-sm flex">
						<view class="text-cut">{{item.LMOBILE}}</view>
					</view>
				</view>
			</view>
		</block>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	export default {
		name: 'ListForm',
		data() {
			return {
				ip: uni.getStorageSync('IP') + ':' + uni.getStorageSync('PORT'),
			}
		},
		computed: {
			...mapGetters([
				'BackGroundBox',
			]),
		},
		props: {
			list: {
				type: Array,
				default: () => {
					return []
				}
			},
			marginTop: {
				type: Number,
				default: 0,
			}
		},
		methods: {
			backTo(item) {
				this.$emit('backTo', item)
			}
		}
	}
</script>

<style >
	page {
		background-color: whitesmoke;
	}
</style>
